$(function () {
  // 点击“去注册账号”的链接
  $("#link_reg").on("click", function () {
    $(".login-box").hide();
    $(".reg-box").show();
  });

  // 点击“去登录”的链接
  $("#link_login").on("click", function () {
    $(".login-box").show();
    $(".reg-box").hide();
  });
  // 定义校验规则
  let form = layui.form;
  // 下面直接校验
  form.verify({
    // 自定义了一个叫做 pwd 校验规则
    pwd: [/^[\S]{6,12}$/, "密码必须6到12位，且不能出现空格"],
    /* 校验两次密码是否一样 */
    repwd(value) {
      // 首先获取里面的内容的值
      var pwd = $(".reg-box [name=password]").val();
      console.log($(".reg-box [name=password]"));
      // 下面进行判断
      if (pwd !== value) {
        return "两次密码不一致";
      }
    },
  });
  // 监听事件
  // 首先阻止表单默认提交
  $("#form_reg").on("submit", function (e) {
    e.preventDefault(); //阻止表单默认提交
    // 接下来发送ajax请求
    $.ajax({
      url: "http://api-breakingnews-web.itheima.net/api/reguser",
      type: "POST",
      data: {
        username: $("#form_reg [name=username]").val(),
        password: $("#form_reg [name=password]").val(),
      },
      success(res) {
        if (res.status !== 0) {
          return layer.msg(res.message);
        }
        layer.msg("注册成功，请登录！");
        // 触发去登录的点击事件
        $("#link_login").click();
      },
    });
  });
  // 下面是登录页面监听事件
  $("#form_login").on("submit", function (e) {
    e.preventDefault(); //阻止表单默认行为
    // 下面开始ajax请求
    $.ajax({
      url: "/api/login",
      type: "POST",
      data: $(this).serialize(), //获得当前的数据
      success(res) {
        console.log(res);
        if (res.status !== 0) {
          return layer.msg("登录失败");
        }
        layer.msg("登录成功");
        // 存储到本地
        localStorage.setItem("token", res.token);
        // 跳转页面
        location.href = "/index.html";
      },
    });
  });
});
